<template>
<div class="container">
    <mu-raised-button v-for="(item,index) in subjectData" :backgroundColor="clicked==index?'red':''" :label="item" @click="clickme(index)" fullWidth/>
</div>
</template>
<script>
	export default {
 	data () {
      return {
        subjectData:[],
        clicked:null
      }
    },
    mounted(){
      this.subject()
    },
    methods: {
    	clickme(val){
    		this.clicked=val
    		this.gotoAddress(this.subjectData[val],'/rank')
    	},
    	gotoAddress(value,path){
    		this.$router.push({
      			path:path,
      			query:{'subject':value}
      		})
    	},
    	subject(){
      		let that = this
            that.axios.get('/iyx/QuestionBank/SubjectInfo/').then(function (response) {
		    	that.subjectData=response.data
		        console.info(response.data)
		        console.info(that.subjectData)})
        }
    }
}
</script>
<style>
  .container{
    display: flex;
    flex-wrap: wrap;
  }
  .demo-raised-button {
    margin: 12px;
  }
</style>